import { Draw } from "ol/interaction";
import { createBox } from "ol/interaction/Draw.js";
import { Circle as CircleStyle, Fill, Stroke, Style } from "ol/style";
import { Vector as VectorLayer } from "ol/layer";
import { Vector as VectorSource } from "ol/source";
import { unByKey } from "ol/Observable";
import Feature from "./feature.js";
export default class DrawManage extends Feature {
	constructor(ol) {
		super();
		this.ol = ol;
		this.layers = [];
		this.draw = null;
		this.tipList = [];
		this.vectorLayer = null;
		this.drawing = false;
	}
	getVectorSource() {
		let layersGroup = this.ol.getAllLayers();
		let vector = layersGroup[6];
		return vector.getSource();
	}
	drawType(source, type) {
		let draw = new Draw({
			source: source,
			type: type === "Rectangle" ? "Circle" : type,
			geometryFunction: type === "Rectangle" ? createBox() : "",
			style: new Style({
				fill: new Fill({
					color: "rgba(121, 186, 217, 0.2)",
				}),
				stroke: new Stroke({
					color: "#50a5d2",
					lineDash: [10, 10],
					width: 2,
				}),
				image: new CircleStyle({
					radius: 5,
					fill: new Fill({
						color: "rgba(121, 186, 217, 0.2)",
					}),
					stroke: new Stroke({
						color: "rgba(121, 186, 217, 1)",
						width: 2,
					}),
				}),
			}),
		});
		return draw;
	}
	drawImage(type) {
		if (this.drawing) return;
		this.startDraw(type);
		this.endDraw(type);
	}
	startDraw(type) {
		const source = this.getVectorSource();
		this.draw = this.drawType(source, type);
		this.ol.addInteraction(this.draw);
		this.drawing = true;
	}
	endDraw(type) {
		this.draw.on("drawend", (evt) => {
			let tip = this.showTip(evt, type, this.ol);
			this.ol.addOverlay(tip);
			this.tipList.push(tip);
			this.ol.removeInteraction(this.draw);
			this.drawing = false;
		});
	}
	delDraw() {
		let source = this.getVectorSource();
		source.clear();
		this.tipList.forEach((item) => {
			this.ol.removeOverlay(item);
		});
	}
	getLocation() {
		this.ol.getTargetElement().style.cursor = "crosshair";
		let location = null;
		const that = this;
		location = this.ol.on("singleclick", function (e) {
			alert(`经度：${e.coordinate[0]}纬度：${e.coordinate[1]}`);
			unByKey(location); //清除鼠标点击事件
			that.ol.getTargetElement().style.cursor = "default";
		});
	}
}
